<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:insert="~{include :: header('图片详情')}" />
</head>
<body class="hold-transition">
<div class="container-fluid mt-2 mb-2">
    <form id="form-user-add" class="form-horizontal"  th:object="${picture}">
        <div class="form-group row">
            <label class="col-sm-2 text-sm-right col-form-label">标题:</label>
            <span class="col-sm-8 col-form-label" th:text="*{title}"></span>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 text-sm-right col-form-label">专业:</label>
            <span class="col-sm-3 col-form-label" th:text="${subjectName}"></span>
            <label class="col-sm-2 text-sm-right col-form-label">类别:</label>
            <span class="col-sm-3 col-form-label" th:text="*{categoryName}"></span>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 text-sm-right col-form-label">频道:</label>
            <span class="col-sm-3 col-form-label" th:text="${channel.channelName}"></span>
            <label class="col-sm-2 text-sm-right col-form-label">等级:</label>
            <span class="col-sm-3 col-form-label" th:text="${member}"></span>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 text-sm-right col-form-label">售价:</label>
            <span class="col-sm-3 col-form-label text-red" th:text="*{(price/100) + ' 元'}"></span>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 text-sm-right col-form-label">封面地址:</label>
            <span class="col-sm-8 col-form-label" onclick="viewImage(this.innerText)" th:text="*{coverUrl}"></span>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 text-sm-right col-form-label">预览地址:</label>
            <span class="col-sm-8 col-form-label" onclick="viewImage(this.innerText)" th:text="*{viewUrl}"></span>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 text-sm-right col-form-label">原图地址:</label>
            <span class="col-sm-8 col-form-label" onclick="viewImage(this.innerText)" th:text="*{imgUrl}"></span>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 text-sm-right col-form-label">上传人:</label>
            <span class="col-sm-3 col-form-label" th:text="*{userName}"></span>
            <label class="col-sm-2 text-sm-right col-form-label">上传时间:</label>
            <span class="col-sm-3 col-form-label" th:text="${#strings.replace(picture.createTime,'T',' ')}"></span>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 text-sm-right col-form-label">下载:</label>
            <span class="col-sm-3 col-form-label" th:text="*{downCount}"></span>
            <label class="col-sm-2 text-sm-right col-form-label">浏览:</label>
            <span class="col-sm-3 col-form-label" th:text="*{viewCount}"></span>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 text-sm-right col-form-label">状态:</label>
            <span class="col-sm-3 col-form-label" th:text="${picture.status == 1?'上架':'下架'}"></span>
            <label class="col-sm-2 text-sm-right col-form-label">属性:</label>
            <div class="col-sm-2 pt-2">
                <label for="isElite"><input type="checkbox" value="1" name="isElite" id="isElite" th:checked="*{isElite==1}" onchange="updateIsElite()"> 推荐</label>
                &nbsp;&nbsp;&nbsp;
                <label for="isTop"><input type="checkbox" value="1" name="isTop" id="isTop" th:checked="*{isTop==1}" onchange="updateIsTop()"> 固顶</label>
            </div>
        </div>
    </form>
</div>
<th:block th:insert="~{include :: footer}" />
<script >
    var prefix = "/picture";
    var pictureId = [[${picture.id}]];
    //固顶操作
    function updateIsTop() {
        var isTop = $("#isTop").prop("checked")?1:0;
        var str;
        if (isTop === 1) {
            str = "确定执行固顶操作"
        } else {
            str = "确定取消固顶操作"
        }
        $.modal.confirm(str, function () {
            var data = {"id": pictureId, "isTop": isTop};
            $.post(prefix + "/update/top.json",data,function (json) {
                if(json.code === 0){
                    location.reload()
                }
            })
        });
    }

    //推荐操作
    function updateIsElite() {
        var isElite = $("#isElite").prop("checked") ? 1 : 0;
        var str = "";
        if (isElite === 1) {
            str = "确定执行推荐操作"
        } else {
            str = "确定取消推荐操作"
        }
        $.modal.confirm(str, function () {
            var data = {"id": pictureId, "isElite": isElite};
            $.post(prefix + "/update/elite.json", data, function (json) {
                if (json.code === 0) {
                    location.reload()
                }
            })
        });
    }
</script>
</body>
</html>